<template>
	<div class="w100 h100 flex-col">
		<my-box class="m-b-10 p-t-26" title="日采煤效能分析" style="flex: 4">
			<template #right>
				<div class="flex">
					<div class="flex-center m-l-10">
						<my-date-picker @change="energyEfficiencyFn()" type="Date" now v-model="form.dateTime" placeholder="请选择日期" />
					</div>
					<div class="flex-center m-l-10">
						<my-select
							:list="testPointType"
							@change="energyEfficiencyFn()"
							:clearable="false"
							:teleported="false"
							v-model="form.mechanizedMiningFaceId"
							placeholder="请选择综采面"
						/>
					</div>
				</div>
			</template>
			<my-echarts :options="options"></my-echarts>
		</my-box>
		<my-box class="m-b-10" title="分析结果" style="flex: 2">
			<my-echarts :options="options2"></my-echarts>
		</my-box>
	</div>
</template>

<script setup name="/MakeDecision/efficiency">
import { energyEfficiency, analysis } from '@a/make-decision-efficiency'

/***************************************************************日采煤效能分析***************************************/
let testPointType = [
		{
			dictLabel: '302综采面',
			dictValue: 302
		},
		{
			dictLabel: '403综采面',
			dictValue: 403
		}
	],
	form = ref({
		dateTime: '',
		mechanizedMiningFaceId: 302
	}),
	options = computed(() => {
		let seriesData = [
			{
				name: '煤机行程',
				data: efficiencyData.value.machineRoute,
				type: 'line',
				yAxisIndex: 0,
				symbol: 'circle',
				symbolSize: 7,
				barWidth: 14,
				splitNumber: 6,
				smooth: false,
				lineStyle: {
					width: 1
				}
			},
			{
				name: '原煤产量',
				type: 'line',
				yAxisIndex: 1,
				symbol: 'circle',
				symbolSize: 7,
				barWidth: 14,
				splitNumber: 6,
				smooth: false,
				lineStyle: {
					width: 1
				},
				data: efficiencyData.value.coalYield
			},
			{
				show: false,
				name: '割煤刀数',
				data: efficiencyData.value.coalCutting,
				type: 'line',
				yAxisIndex: 0,
				symbol: 'circle',
				symbolSize: 7,
				barWidth: 14,
				splitNumber: 6,
				smooth: false,
				lineStyle: {
					width: 1
				}
			},
			{
				name: '用电量',
				data: efficiencyData.value.electricity,
				type: 'line',
				yAxisIndex: 0,
				symbol: 'circle',
				symbolSize: 7,
				barWidth: 14,
				splitNumber: 6,
				smooth: false,
				lineStyle: {
					width: 1
				}
			},
			{
				name: '吨煤用电',
				data: efficiencyData.value.tonsOfElectricity,
				type: 'line',
				yAxisIndex: 0,
				symbol: 'circle',
				symbolSize: 7,
				barWidth: 14,
				splitNumber: 6,
				smooth: false,
				lineStyle: {
					width: 1
				}
			}
		]

		return EpitionsFn({
			grid: {
				top: 60,
				left: 20
			},
			legend: {
				...Elegend,
				selected: {
					割煤刀数: false,
					用电量: false,
					吨煤用电: false
				}
			},
			xAxis: {
				data: efficiencyData.value.datetime
			},
			yAxis: [
				{
					name: '煤机行程（米）',
					type: 'value',
					splitLine: {
						show: false
					},
					axisLabel: {
						fontSize: 12,
						color: '#fff',
						interval: 'auto'
					},
					splitLine: {
						show: true,
						lineStyle: {
							color: 'rgba(224,230,241,0.2)',
							type: 'dashed'
						}
					},
					axisTick: {
						show: false
					}
				},
				{
					name: '原煤产量（吨）',
					type: 'value',
					splitLine: {
						show: false
					},
					axisLabel: {
						fontSize: 12,
						color: '#fff',
						interval: 'auto'
					},
					splitLine: {
						show: true,
						lineStyle: {
							color: 'rgba(224,230,241,0.2)',
							type: 'dashed'
						}
					},
					axisTick: {
						show: false
					}
				}
			],
			series: seriesData
		})
	})
let efficiencyData = ref({})
watchEffect(() => {
	energyEfficiency(form.value).then((res) => {
		efficiencyData.value = res.data
	})
})

//分析结果
let analysisData = ref({}),
	options2 = computed(() => {
		const {
			highSpeedCoal,
			lowEnergyCoal,
			shallowCoal,
			bottomCoal,
			efficientCoal,
			afterCoal,
			highEnergyCoal,
			lowSpeedCoal,
			stopCoal,
			lowEfficientCoal
		} = analysisData.value

		let seriesData = [
			{
				data: [
					highSpeedCoal,
					lowEnergyCoal,
					shallowCoal,
					bottomCoal,
					efficientCoal,
					afterCoal,
					highEnergyCoal,
					lowSpeedCoal,
					stopCoal,
					lowEfficientCoal
				],
				type: 'bar',
				barWidth: 15,
				itemStyle: {
					normal: {
						barBorderRadius: [10, 10, 0, 0]
					}
				}
			}
		]
		return EpitionsFn({
			legend: Elegend,
			xAxis: {
				data: ['高速采煤', '低能耗采煤', '浅截齿采煤', '拾底煤', '高效采煤', '后溜放顶煤', '高耗能采煤', '低速采煤', '煤机停止（空转）', '低效采煤']
			},
			series: seriesData
		})
	})

analysis().then((res) => {
	analysisData.value = res.data
})
</script>

<style lang="scss" scoped></style>
